<!DOCTYPE HTML>

<html lang="pt-br"  
	xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui">
	
<ui:composition template="/WEB-INF/template/ConhecimentoTemplate.xhtml">
<ui:define name="corpo">
	<style type="text/css">
	.div-tela 
	{
		max-width: auto;
		padding: 10px 10px 10px;
	    margin: 0 auto 20px;
	    background-color: #fff;
	    border: 1px solid #e5e5e5;
	    -webkit-border-radius: 5px;
	    	-moz-border-radius: 5px;
	        	border-radius: 5px;
	    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	    	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.05);
	        	box-shadow: 0 1px 2px rgba(0,0,0,.05);
	}
	.colunaEsquerda
	{  
	    text-align: left;
	    width: 30%;  
	}  
	.colunaDireita
	{  
	    text-align: left;
	    width: 70%;
	}
	.pnlMindMap
	{
		max-width: auto;
		height: auto;
	}   
	.mindMap
	{
		max-width: auto;
		height: 450px;
		border: 1px solid black;
	}   
	</style>
<div class="div-tela">
	<p:panel id="pnlVendaFiltro"
			toggleable="false"
			closable="false"
			header="Filtro">
		<p:commandButton id="btnFiltro"
						styleClass="ui-priority-primary"
			        	actionListener="#{managerVendaMensalBean.abrirFiltro}"
			        	update=":frmConhecimento:pnlFiltro"
			        	value="Filtro Dados Vendas"/>
		
		<p:commandButton id="btnSair" 
						value="Sair" 
						styleClass="ui-priority-primary"
						actionListener="#{managerVendaMensalBean.sair}"/>
	</p:panel>
	<div>
			<BR />
		</div>
		<p:dataTable id="tblClienteDadosDetalhe"
					var="clienteDadosDetalhe"
					value="#{managerVendaMensalBean.lstClienteDadosDetalhe}"
					emptyMessage="Não há Dados Para Exibição."
					scrollable="true"
					scrollHeight="370">
				
			<p:column filterBy="#{clienteDadosDetalhe.clienteVo.id}" filterMatchMode="contains" filterStyle="width:100%" width="10%">
				<h:outputText value="#{clienteDadosDetalhe.clienteVo.id}" />
			</p:column>
			
			<p:column filterBy="#{clienteDadosDetalhe.clienteVo.razao}" filterMatchMode="contains" filterStyle="width:100%" width="30%">
				<h:outputText value="#{clienteDadosDetalhe.clienteVo.razao}" />
			</p:column>
			
			<p:column headerText="Data Cadastro" width="10%">
				<h:outputText value="#{clienteDadosDetalhe.clienteVo.dataCadastro}">
					<f:convertDateTime pattern="dd/MM/yyyy"/>
				</h:outputText>
			</p:column>
			
			<p:column headerText="R" width="5%">
				<h:outputText value="#{clienteDadosDetalhe.ranking}" />
			</p:column>
			
			<p:column headerText="Cl" style="background-color:#{clienteDadosDetalhe.corClassificacaoABCMesHum};" width="5%">
				<h:outputText value="#{clienteDadosDetalhe.classificacaoABCMesHum}" style="color:#FFFFFF;"/>
			</p:column>
			        		
			<p:column headerText="#{managerVendaMensalBean.clienteDadosDetalheVo.mesLabelMesHum}" width="10%">
				<h:outputText value="#{clienteDadosDetalhe.valorTotalCompra}">
					<f:convertNumber currencySymbol="R$" type="currency"/> 
				</h:outputText>
			</p:column>
		</p:dataTable>
	
</div>	
</ui:define>
<ui:define name="modal">

	<p:dialog widgetVar="diagFiltro" 
			header="Filtro Dados Vendas"
			modal="true"
			showEffect="fade"
			hideEffect="fade"
			resizable="false"
			width="400"
			position="top">
		
			<p:panelGrid id="pnlFiltro" 
				columns="2" columnClasses="colunaEsquerda, colunaDireita" style="width:100%; border:none;" >
				<h:outputLabel for="slcMes" value="Mês: " />
					<p:selectOneMenu id="slcMes" 
									value="#{managerVendaMensalBean.clienteDadosDetalheVo.mesCompetencia}"
									style="width:100%;">
						<f:selectItem itemLabel="Janeiro" itemValue="1"/>
						<f:selectItem itemLabel="Fevereiro" itemValue="2"/>
						<f:selectItem itemLabel="Março" itemValue="3"/>
						<f:selectItem itemLabel="Abril" itemValue="4"/>
						<f:selectItem itemLabel="Maio" itemValue="5"/>
						<f:selectItem itemLabel="Junho" itemValue="6"/>
						<f:selectItem itemLabel="Julho" itemValue="7"/>
						<f:selectItem itemLabel="Agosto" itemValue="8"/>
						<f:selectItem itemLabel="Setembro" itemValue="9"/>
						<f:selectItem itemLabel="Outubro" itemValue="10"/>
						<f:selectItem itemLabel="Novembro" itemValue="11"/>
						<f:selectItem itemLabel="Dezembro" itemValue="12"/>
					</p:selectOneMenu>
				<h:outputLabel for="slcAno" value="Ano: " />
					<p:selectOneMenu id="slcAno" 
									value="#{managerVendaMensalBean.clienteDadosDetalheVo.anoCompetencia}"
									style="width:100%;">
						<f:selectItem itemLabel="2014" itemValue="2014"/>
						<f:selectItem itemLabel="2015" itemValue="2015"/>
						<f:selectItem itemLabel="2016" itemValue="2016"/>
					</p:selectOneMenu>
				<h:outputLabel for="somVendedor" value="Vendedor:"/>
					<p:selectOneMenu id="somVendedor" 
		            					value="#{managerVendaMensalBean.clienteDadosDetalheVo.funcionarioVo.id}" 
		             					style="width:100%;">
			             	<f:selectItems var="vendedor" 
			             				value="#{managerVendaMensalBean.listaFuncionario}" 
			             				itemLabel="#{vendedor.nome}" 
			             				itemValue="#{vendedor.id}"/>
		             </p:selectOneMenu>
			</p:panelGrid>
			
		<div>
			<BR />
		</div>
		<p:commandButton id="btnFiltrar" 
					update=":frmConhecimento:tblClienteDadosDetalhe"
					styleClass="ui-priority-primary"
					value="Filtrar" 
					actionListener="#{managerVendaMensalBean.carregarDados}"/>	
	</p:dialog>
	
	
</ui:define>
</ui:composition>
</html>